// 添加和修改的结构时一样的.所以定义成一个组件
import React from 'react'
import { Card, Form, Input, Button } from 'antd'

export default function AddOrUpdateHospitalSet() {
  return (
    <Card>
      <Form
        name="basic" //当前form表单的名字
        labelCol={{ span: 3 }}
      >
        <Form.Item
          // 用于给当前表单元素,添加描述文本
          label="医院名称"
          name="hosname"
          rules={[{ required: true, message: '请输入医院名称' }]}
        >
          <Input placeholder="医院名称" />
        </Form.Item>
        <Form.Item
          // 用于给当前表单元素,添加描述文本
          label="医院编码"
          name="hoscode"
          rules={[{ required: true, message: '请输入医院编码' }]}
        >
          <Input placeholder="医院编码" />
        </Form.Item>
        <Form.Item
          // 用于给当前表单元素,添加描述文本
          label="api基础路径"
          name="apiUrl"
          rules={[{ required: true, message: '请输入api基础路径' }]}
        >
          <Input placeholder="api基础路径" />
        </Form.Item>
        <Form.Item
          // 用于给当前表单元素,添加描述文本
          label="联系人姓名"
          name="contactsName"
          rules={[{ required: true, message: '请输入联系人姓名' }]}
        >
          <Input placeholder="联系人姓名" />
        </Form.Item>
        <Form.Item
          // 用于给当前表单元素,添加描述文本
          label="联系人手机号"
          name="contactsPhone"
          rules={[
            {
              required: true,
              message: '请输入联系人手机号',
              pattern: /^1[3-9]\d{9}$/,
            },
          ]}
        >
          <Input placeholder="联系人手机号" />
        </Form.Item>

        <Form.Item wrapperCol={{ offset: 3 }}>
          {/* Button有htmlType="submit"则表示这个按钮是当前表单的提交按钮 */}
          <Button type="primary" htmlType="submit" style={{ marginRight: 10 }}>
            保存
          </Button>
          <Button type="default">返回</Button>
        </Form.Item>
      </Form>
    </Card>
  )
}
